import { Layout } from 'antd';
import { useSelector } from 'umi';
import PageSider from './components/PageSider';
import PageFooter from './components/PageFooter';
import PageHeader from './components/PageHeader';
import styles from './index.less';

const { Content } = Layout;

const LayoutPage = (props: any) => {
  const { children } = props;
  const {
    user: { userInfo },
  }: any = useSelector((state) => state);

  return (
    <Layout className={styles.layoutContainer}>
      <PageSider />
      <Layout className={styles.content}>
        <PageHeader userinfo={userInfo} />
        <Content>{children}</Content>
        <PageFooter />
      </Layout>
    </Layout>
  );
};

export default LayoutPage;
